import React, { Suspense } from 'react';
// import {Route,Switch,withRouter} from 'react-router-dom'
import { renderRoutes } from "react-router-config";
import routes from './routes'
import Loading from './components/loading'
import {TabBar, TabItem} from './components/app-tab-bar/TabBar'

const tabData=[
  {
    id:1,
    name:'首页',
    path:'/home',
    iconClassname:'icon-shouye',
  },
  {
    id:2,
    name:'分类',
    path:'/category',
    iconClassname:'icon-zixun',
  },
  {
    id:3,
    name:'购物车',
    path:'/cart',
    iconClassname:'icon-icon-',
  },{
    id:4,
    name:'我的',
    path:'/mine',
    iconClassname:'icon-jiaoshi',
  }
]
export default function App() {
    return (
      <div className="app" id='app'>
        <Suspense fallback={<Loading></Loading>}>
            {renderRoutes(routes)}
            <TabBar>
              {tabData.map(item=>{
                return <TabItem key={item.id} {...item}/>
              })}
            </TabBar>
        </Suspense>
      </div>
    )
}
